<template>
  <div class="app-container">
    <SearchContent :queryParams="queryParams" @query="handleQuery" @reset="resetQuery">
      <el-col :span="6">
        <el-form-item label="车架号:" prop="vinNo">
          <el-input v-model="queryParams.vinNo" clearable placeholder="请输入车架号"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="车牌号:" prop="carNo">
          <el-input v-model="queryParams.carNo" clearable placeholder="请输入车牌号"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="车辆归属:" prop="ascription">
          <el-input v-model="queryParams.ascription" clearable placeholder="请输入车辆归属"></el-input>
        </el-form-item>
      </el-col>

      <el-col :span="6">
        <el-form-item label="来源:" prop="purchaseSource">
          <el-select v-model="queryParams.purchaseSource" clearable>
            <el-option v-for="dict in dict.type.in_storage_source" :label="dict.label" :value="dict.value" :key="dict.value"></el-option>
          </el-select>
        </el-form-item>
      </el-col>

      <el-col :span="6">
        <el-form-item label="业务类型:" prop="businessScopeCode">
          <el-select v-model="queryParams.businessScopeCode" clearable>
            <el-option label="全部" :value="0"></el-option>
            <el-option label="自营" :value="1"></el-option>
            <el-option label="渠道" :value="2"></el-option>
          </el-select>
        </el-form-item>
      </el-col>

      <el-col :span="6">
        <el-form-item label="状态:" prop="storageStatus">
          <el-select v-model="queryParams.storageStatus" clearable>
            <el-option label="全部" :value="0"></el-option>
            <el-option label="待入库" :value="1"></el-option>
            <el-option label="已入库" :value="2"></el-option>
          </el-select>
        </el-form-item>
      </el-col>

      <el-col :span="6">
        <el-form-item label="客户名称:" prop="customerName">
          <el-input v-model="queryParams.customerName" clearable placeholder="请输入客户名称"></el-input>
        </el-form-item>
      </el-col>
    </SearchContent>

    <div class="card-wrap paddingAll20" :model="queryParams" label-width="86px">
      <div class="table-title-wrap justify-end">
        <el-button type="primary" size="mini" @click="handleExport" v-hasPermi="['carInventory:inInventory:export']">导出 </el-button>
      </div>

      <table-page :loading="loading" :dataList="dataList" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @setSizeCurrent="getList" border>
        <!-- 操作插槽 -->
        <template slot="tableColAc">
          <el-table-column label="操作" align="center" class-name="small-padding fixed-width" min-width="160px">
            <template v-slot="{ row }">
              <e-button v-if="row.saveFlag !== 2" size="mini" type="text" @click="handleOperate(1, row)" v-hasPermi="['carInventory:inInventory:edit']">入库 </e-button>
              <e-button size="mini" type="text" @click="handleOperate(4, row)" v-hasPermi="['carInventory:inInventory:detail']">查看 </e-button>
            </template>
          </el-table-column>
        </template>
        <!-- 普通列插槽 -->
        <template slot="tableCol">
          <el-table-column label="业务单号" align="center" prop="businessNo" min-width="180px" show-overflow-tooltip />
          <el-table-column label="子订单编号" align="center" prop="orderNo" min-width="180px" show-overflow-tooltip>
            <template v-slot="{ row }">
              <span class="goorder" @click="goOrder(row.orderCarCode)">{{ row.orderCarCode }}</span>
            </template>
          </el-table-column>
          <el-table-column label="客户名称" align="center" prop="customerName" min-width="120px" show-overflow-tooltip />
          <el-table-column label="来源" align="center" prop="purchaseSource" min-width="120px" show-overflow-tooltip>
            <template v-slot="{ row }">
              <dict-tag :options="dict.type.in_storage_source" :value="row.purchaseSource" />
            </template>
          </el-table-column>
          <el-table-column label="采购编号" align="center" prop="purchaseNo" min-width="120px" show-overflow-tooltip />
          <el-table-column label="品牌" align="center" prop="brandName" min-width="120px" show-overflow-tooltip />
          <el-table-column label="车架号" align="center" prop="vinNo" min-width="150px" show-overflow-tooltip />
          <el-table-column label="车牌号" align="center" prop="carNo" min-width="120px" show-overflow-tooltip />
          <el-table-column label="业务类型" align="center" prop="value" min-width="120px" show-overflow-tooltip>
            <template v-slot="{ row }">
              <dict-tag :options="dict.type.business_type" :value="row.businessScope" />
            </template>
          </el-table-column>
          <el-table-column label="车辆归属" align="center" prop="ascription" min-width="120px" show-overflow-tooltip />
          <el-table-column label="状态" align="center" prop="createTime" min-width="120px" show-overflow-tooltip>
            <template v-slot="{ row }">
              <dict-tag :options="dict.type.in_storage_status" :value="row.inStorageStatus" />
            </template>
          </el-table-column>
          <!-- <el-table-column label="审核节点" align="center" prop="createTime" min-width="120px" show-overflow-tooltip/> -->
          <el-table-column label="审核状态" align="center" prop="auditStatus" min-width="120px" show-overflow-tooltip />
          <el-table-column label="操作人" align="center" prop="updateBy" min-width="120px" show-overflow-tooltip />
          <el-table-column label="操作时间" align="center" prop="updateTime" min-width="120px" show-overflow-tooltip />
        </template>
      </table-page>
    </div>
  </div>
</template>

<script>
import SearchContent from '@/components/SearchContent/index.vue'
import * as inInventoryApi from '@/api/carInventory/inInventory'
import * as outInventoryApi from '@/api/carInventory/outInventory'
export default {
  name: 'InInventoryList',
  components: {
    SearchContent,
  },
  dicts: ['business_type', 'purchase_source', 'in_storage_status', 'in_storage_source'],
  data() {
    return {
      // 遮罩层
      loading: false,
      retutnCarTimes: [],
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        vinNo: null,
        carNo: null,
        ascription: null,
        purchaseSource: null,
        businessScopeCode: null,
        storageStatus: null,
        customerName: null,
      },
      total: 0,
      dataList: [],
    }
  },
  mounted() {
    this.getList()
  },
  activated() {
    this.handleQuery()
  },
  methods: {
    // 详情
    goOrder(orderCode) {
      if (this.Empty(orderCode)) return
      return new Promise((resolve) => {
        outInventoryApi
          .outOrderDetails(orderCode)
          .then((res) => {
            if (res.code == 200) {
              this.$router.push({
                name: 'SuborderDetail',
                query: {
                  id: res.data.orderCarId,
                  orderId: res.data.orderCode,
                },
              })
            } else {
              throw new Error(res)
            }
          })
          .catch((err) => resolve())
      })
    },
    /** 查询列表 */
    getList() {
      this.loading = true
      let param = JSON.parse(JSON.stringify(this.queryParams))
      if (param.storageStatus == 0) {
        param.storageStatus = ''
      }
      if (param.businessScopeCode == 0) {
        param.businessScopeCode = ''
      }
      inInventoryApi
        .inStorageList(param)
        .then((res) => {
          this.dataList = res.rows
          this.total = res.total
        })
        .finally(() => {
          this.loading = false
        })
    },

    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1
      this.getList()
    },

    /** 重置按钮操作 */
    resetQuery() {
      ;(this.queryParams = {
        pageNum: 1,
        pageSize: 10,
        vinNo: null,
        carNo: null,
        ascription: null,
        purchaseSource: null,
        businessScopeCode: null,
        storageStatus: null,
        customerName: null,
      }),
        this.handleQuery()
    },

    handleOperate(type, row) {
      switch (type) {
        case 1: //入库
          if (row.purchaseSource !== '6') {
            this.$router.push({
              name: 'InInventory',
              query: {
                inboundId: row.inboundId,
                viewType: 0,
                source: row.purchaseSource == '4' ? 1 : 2, // 用来判断显示采购信息还是外部转租赁（4）
              },
            })
          } else {
            this.$router.push({
              name: 'InInventoryTche',
              query: {
                // 子订单ID
                orderId: row.orderId,
              },
            })
          }

          break
        case 3: //作废
          this.deleteRow(row)
          break
        case 4: //查看
          if (row.purchaseSource !== '6') {
            this.$router.push({
              name: 'InInventoryDetail',
              query: {
                inboundId: row.inboundId,
                viewType: 0,
                source: row.purchaseSource == '4' ? 1 : 2, // 用来判断显示采购信息还是外部转租赁
              },
            })
          } else {
            this.$router.push({
              name: 'DetailTche',
              query: {
                // 子订单ID
                orderId: row.orderId,
              },
            })
          }

          break
      }
    },
    deleteRow(row) {
      this.$confirm('此操作将作废该入库单, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(() => {
        inInventoryApi.deleteInStorage(row.inboundId).then((res) => {
          this.handleQuery()
          this.$message.success('作废成功')
        })
      })
    },
    // 导出
    handleExport() {
      this.download(
        '/inStorage/exportList',
        {
          ...this.queryParams,
        },
        `入库列表_${new Date().getTime()}.xlsx`
      )
    },
  },
}
</script>
<style scoped>
.goorder {
  color: blue;
  cursor: pointer;
}
</style>
